body { 
	overflow: hidden;
}
.container {
	position: relative;
    width:100%;
    height:100%;
	transition: 1s ease-out;
	-webkit-transition: 0.5s ease-out;
	padding: 0;
	margin: 0;
    color:#fff9eb;
}
.panel { 
	height: 100vh;
	width: 100%;
	background: #f7f7f7;
	position: relative;
	text-align: center;
	font: 20px/100vh 'Courier New', monospace;
	margin: 0 0 0 0;
}
#section0 .panel{
	background-image:url('../imgs/background/cont2-bg.jpg') ;
	background-size: cover;
}
#section1 .panel{
	background-image:url('../imgs/background/cont1-bg.png') ;
	background-size: cover;
}
/* 视频播放 动画 */
#section0 .btn-play{
    width:  151px;
    height: 151px;
    background-image:url('../imgs/play.png');
    /* （1） */
    position: relative;
    left: 168px;
    margin-left: -50px;
    top: 250px;
    margin-top: -100px;
    z-index: 9;
    overflow: hidden;
    transition: all 0.5s;
	display: block;
}
.panel .view{
    width:  350px;
    height: 350px;
    /* （1） */
    position: relative;
    left: 38%;
    top: 15%;
}
#view0:hover .btn-play{
    display:block;
}
#section0 .btn-play:hover{
	z-index: 5;
  	-webkit-transform: scale(1.2);
}
.videoPop {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 98;
    display: none;
}
.videoPlay {
    width: 745px;
    height: 418px;
    padding: 20px 0 0 27px;
    background-image: url('../imgs/video-bg.png');
    /* （3） */
    position: relative;
    left: 50%;
    top: 20%;
    z-index: 99;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    box-sizing: border-box;
}
.videoPlay #video {
    width: 688px;
    height: 384px;
}
.videoPop .close{
    /* （4） */
    position: relative;
    left: 50%;
    margin-right: 970px;
    top: 50%;
    margin-top: -1050px;
    width: 55px;
    height: 57px;
    cursor: pointer;
    background-image: url('../imgs/dia-close.png');
    background-repeat: no-repeat;
    z-index: 9999;
}
/* TAP论坛 bilibili */
.btn-bili {
    width: 127px;
    height: 126px;
    background-image: url('../imgs/btn-bili.png');
    position: absolute;
    z-index: 3;
    right: 15px;
    bottom: 170px;
    transition: all .4s;
}
.btn-bili:hover{
    transform: scale(1.1);
}
.btn-tap {
    width: 126px;
    height: 126px;
    background-image: url('../imgs/btn-tap.png');
    position: absolute;
    z-index: 3;
    right: 15px;
    bottom: 50px;
    transition: all .4s;
}
.btn-tap:hover{
    transform: scale(1.1);
}
/* 推特 脸书 链接 */
.nav-box{
    /* （5） */
	position: relative;
	left: 80%;
	top: -470px;
	width: 200px;
	height: 41px;
	background-image: url('../imgs/sp-icon.png');
}
.nav-box li{
	list-style: none;
}
.nav-box .ys-li1{
	position: relative;
	top: 8px;
	right: 220px;
	width: 31px;
	height: 35px;
}
.nav-box .ys-li2{
     /* （6） */
	position: relative;
	top: 5px;
	right: -45px;
	width: 31px;
	height: 35px;
}
.nav-box .ys-li3{
     /* （7） */
	position: relative;
	top: -30px;
	right: -100px;
	width: 31px;
	height: 35px;
}
.nav-box .ys-li4{
	position: absolute;
	top: 8px;
	right: 10px;
	width: 31px;
	height: 35px;
}
.nav-box li a{
	display: block;
	width: 31px;
	height: 35px;
	font-size: 0px;
}
.down-box{
	top: 400px;
	width: 337px;
	height: 188px;
	position: absolute;
	left: 50%;
	margin-left: -168px;
	border: 100px;
	z-index: 3;
	box-sizing: border-box;
	padding-top: 3px;
	transition: all .5s;
	animation: ease-in-out;
}
.down-box a{
	width: 159px;
    height: 185px;
    position: relative;
    transition: all .3s;
    transform: scale(.9);
}
/* ios下载 安卓下载 */
.down-box .btn-ios{
	float: left;
    background-image: url('../imgs/btn-ios.png');
    transition: all .4s;
}
.down-box .btn-ios:hover{
    transform: scale(1.1);
}
.down-box .btn-and{
	float: right;
    background-image: url('../imgs/btn-and.png');
    transition: all .4s;
}
.down-box .btn-and:hover{
    transform: scale(1.1);
}
i{
	font-style: italic;
}
/* ios  安卓 guang */
.down-box .btn-ios .guang1{
	left: 3px;
	top: 22px;
	background-image: url('../imgs/ani-guang.png');
}
.down-box .btn-ios .guang2{
	left: 76px;
	top: -22px;
	background-image: url('../imgs/ani-guang.png');
	transform: rotateZ(120deg);
}
.down-box .btn-ios .guang3{
	left: 76px;
	top: 64px;
	background-image: url('../imgs/ani-guang.png');
	transform: rotateZ(-120deg);
}
.down-box .btn-and .guang1{
	right: 3px;
	top: 22px;
	background-image: url('../imgs/ani-guang.png');
	transform: rotateY(180deg);
}
.down-box .btn-and .guang2{
	right: 76px;
	top: -22px;
	background-image: url('../imgs/ani-guang.png');
	transform: rotateZ(-120deg) rotateY(180deg);
}
.down-box .btn-and .guang3{
	right: 76px;
	top: 64px;
	background-image: url('../imgs/ani-guang.png');
	transform: rotateZ(+120deg);
}
/* 动态 DOWNLOAD */
.down-box a i{
	width: 23px;
    height: 145px;
    display: block;
    position: absolute;
	
}
.down-wz{
	width: 131px;
    height: 73px;
    position: absolute;
    left: 50%;
    margin-left: -65px;
    top: -1px;
    background-image: url('../imgs/ani-down.png');
}
.ani-fd{
	animation:ani-fd 3s ease-out infinite;
	animation-duration:3s;
	animation-timing-function:ease-out;
	animation-delay:0s;
	animation-iteration-count:infinite;
	animation-direction: normal;
	animation-fill-mode: none;
	animation-play-state: runnning;
	animation-name: ani-fd;
}
@keyframes ani-fd{
	0%,10%{
		transform: translateY(0);
	}
	50%{
		transform: translateY(-10px);
	}
}
.down-box a i:after {
    animation: ani-guang 3s ease-in-out infinite;
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: ani-guang;
}
#section0 .btn-dk{
    width: 74px;
    height: 110px;
    background-image: url('../imgs/btn-dk.png');
    background-repeat: no-repeat;
    /* （8） */
    position: absolute;
    top: 350px;
    z-index: 9;
    transition: all .25s;
    animation: ease-in-out;
	animation-duration: 0s;
    animation-timing-function: ease-in-out;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: none;
}
/* 新闻弹出框 */
.pr-box{
	width: 100%;
    height: 100%;
    cursor: default;
}
.news-box.on{
	left: 12px;
}
.news-box{
    width: 558px;
    height: 336px;
    background-image: url('../imgs/news-bg.png');
    background-repeat: no-repeat;
    position: absolute;
    left: -596px;
    top: 320px;
    z-index: 9;
    transition: all .4s;
    animation: ease-in-out;
	animation-duration: 0s;
    animation-timing-function: ease-in-out;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: none;
}

.swiper-container {
    margin:20px 0 0 0;
    overflow: hidden;
    list-style: none;
    z-index: 1;
}
.swiper-wrapper {
    position: relative;
    margin-top: 20px;
    width: 530px;
    height: 161px;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box;
}
.swiper-slide {
    flex-shrink: 0;
    height: 100%;
    position: relative;
    transition-property: transform;
}

.swiper-pagination {
    height: 21px;
    position: absolute;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0,0,0);
    z-index: 10;
}
.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000;
}
.news-box .btn-sq {
    width: 35px;
    height: 35px;
    background-image: url('../imgs/btn-sq.png');
    position: absolute;
    right: -38px;
    top: -38px;
    z-index: 9;
}
.swiper-container-horizontal img{
    position: absolute;
    top: -1px;
    left: 1px;
    margin: 0 0;
}
ol, ul {
    list-style: none;
}
ul {
    display: block;
    margin-block-start: 15em;
    margin-block-end: 1em;
    margin-inline-start: 20px;
    margin-inline-end: 0px;
    padding-inline-start: 20px;
}
.news-box .news-tab.on1 i{left: 20;}
.news-box .news-tab.on2 i{left: 90px;}
.news-box .news-tab.on3 i{left: 160px;}
.news-box .news-tab.on4 i{left: 230px;}
.news-box .news-tab i {
    width: 48px;
    height: 28px;
    background-image: url('../imgs/icon-newson.png');
    position: absolute;
    left: 20px;
    top: 5px;
    pointer-events: none;
    transition: all .1s;
    transition-property: all;
    transition-duration: 0.1s;
    transition-timing-function: ease;
    transition-delay: 0s;
}
i {
    font-style: italic;
}
.news-box .news-tab li {
    width: 48px;
    height: 28px;
    float: left;
    margin-right: 22px;
    color: #6a8de6;
    font-size: 18px;
    line-height: 70px;
    text-align: center;
    cursor: pointer;
    position: relative;
    top: -13px;
    transition: all .2s;
    transition-property: all;
    transition-duration: 0.2s;
    transition-timing-function: ease;
    transition-delay: 0s;
}
.news-box .news-con {
    width: 548px;
    height: 100px;
    margin: 225px -20px;
    float:left;
}
.news-box .news-con li {
    width: 580px;
    height: 33px;
    display: none;
}
.news-box .news-con li a {
    width: 538px;
    height: 33px;
    display: block;
    font-size: 16px;
    line-height: 32px;
    color: #fff;
}
em{
    font-style: normal;
    font-weight: normal;
}

.news-box .news-con li a em {
    float: right;
    color: #000;
}
.news-box .news-con li a .tit {
    width: 360px;
    display: inline-block;
    overflow: hidden;
    overflow-x: hidden;
    overflow-y: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: top;
    color: #000;
}
li {
    text-align: -webkit-match-parent;
}
/* 轮播图 */
.rw-box .img-rw-box img{
    -webkit-animation: ease-in-out;
    -moz-animation: ease-in-out;
    animation: ease-in-out;
    display: block;
}
.rw-box {
    width: 100%;
    height: 100%;
    position: relative;
    margin: 0 auto;
    transition: all .5s .6s;
    animation: ease-in-out;
    transform: scale(1);
    opacity: 1;
}
.rw-box .zy-box {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.rw-box .zy-box .img-rw-box {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.rw-box .img-rw-box {
    transition: all .5s;
    animation: ease-in-out;
    transform: translateY(50px);
    opacity: 1;
}
.rw-box .zy-box .img-rw-box:after {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    content: '';
}

.rw-box.on1-1 .zy1-rw1 .img-rw-box{
    background-image: url('../imgs/people/zy1-rw1-big.png');
    background-position: 46% 50%;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
.rw-box.on2-1 .zy2-rw1 .img-rw-box{
    background-image: url('../imgs/people/zy2-rw1-big.png');
    background-position: 46% 50%;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
.rw-box.on3-1 .zy3-rw1 .img-rw-box{
    background-image: url('../imgs/people/zy3-rw1-big.png');
    background-position: 46% 50%;
    background-repeat: no-repeat;
    background-size: auto 100%;
}

.rw-box.on4-1 .zy4-rw1 .img-rw-box{
    background-image: url('../imgs/people/zy4-rw1-big.png');
    background-position: 46% 50%;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
/* 人物名字 */
.rw-box .zy-box .img-name{
    width: 300px;
    height: 155px;
    position: absolute;
    top:450px;
    left:1200px;
}
.rw-box .img-name {
    transition: all .5s;
    animation: ease-in-out;
    transform: translateY(50px);
    opacity: 1;
}
.rw-box .zy-box .img-name:after {
    position: absolute;
    top:350px;
    left:900px;
    content: '';
}
.rw-box.on1-1 .zy1-rw1 .img-name{
    background-image: url('../imgs/people/Edgar.png');
}
.rw-box.on3-1 .zy3-rw1 .img-name{
    background-image: url('../imgs/people/Glen.png');
}
.rw-box.on4-1 .zy4-rw1 .img-name{
    background-image: url('../imgs/people/Seilan.png');
}
.rw-box.on2-1 .zy2-rw1 .img-name{
    background-image: url('../imgs/people/Shiki.png');
}
/* 向前 向后 */
.btn-prev {
    width: 69px;
    height: 71px;
    background-image: url('../imgs/sp-pnl.png');
    background-position: 3px 0;
    position: absolute;
    left: 50%;
    margin-left: -450px;
    top: 50%;
    margin-top: -32px;
    z-index: 1;
    transition: all .5s .6s;
    animation: ease-in-out;
    transform: translateX(0);
    opacity: 1;
}
.btn-next {
    width: 69px;
    height: 71px;
    background-image: url('../imgs/sp-pnr.png');
    background-position: -73px 0;
    position: absolute;
    left: 50%;
    margin-left: 512px;
    top: 50%;
    margin-top: -32px;
    z-index: 1;
    transition: all .5s .6s;
    animation: ease-in-out;
    transform: translateX(0);
    opacity: 1;
}
/* 左边图标  */
.ul-nav {
    width: 127px;
    height: 750px;
    position: absolute;
    left: 50%;
    margin-left: -650px;
    top: 50%;
    margin-top: -285px;
    z-index: 3;
    transition: all .5s .6s;
    animation: ease-in-out;
    transform: translateX(0);
    opacity: 1;
}
.ul-nav li {
    width: 127px;
    height: 127px;
    float: left;
    margin-bottom: 25px;
    background-image: url('../imgs/sp-zy.png');
    cursor: pointer;
    position: relative;
}

.btn-active {
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    transition: all .25s;
    -webkit-animation: ease-in-out;
    -moz-animation: ease-in-out;
    animation: ease-in-out;
}
.ul-nav li:after{
    width: 127px;
    height: 127px;
    position: absolute;
    left: 0;
    top: -10px;
    background-image: url('../imgs/sp-zy.png');
    content: '';
    z-index: 1;
    pointer-events: none;
    transition: all .3s;
    animation: ease-in-out;
    transform: scale(1.8);
    opacity: 0;
}
.ul-nav li:hover:after, .ul-nav li.on:after{
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}
.ul-nav li.ys-li1{background-position: 0 -156px;}
.ul-nav li.ys-li1:after{background-position: 0 0;}
.ul-nav li.ys-li2{background-position: -127px -156px;}
.ul-nav li.ys-li2:after{background-position: -127px 0;}
.ul-nav li.ys-li3{background-position: -254px -156px;}
.ul-nav li.ys-li3:after{background-position: -254px 0;}
.ul-nav li.ys-li4{background-position: -381px -156px;}
.ul-nav li.ys-li4:after{background-position: -381px 0;}
.ul-nav li.ys-li5{background-position: -508px -156px;}
.ul-nav li.ys-li5:after{background-position: -508px 0;}
/* 下方索引 */
.ul-jd {
    width: auto;
    height: 20px;
    text-align: center;
    position: absolute;
    left: 50%;
    margin-left: -105px;
    top: 50%;
    margin-top: 330px;
    transition: all .5s .6s;
    animation: ease-in-out;
    transform: scale(1);
    opacity: 1;
}
.ul-jd li {
    width: 20px;
    height: 20px;
    background-image: url('../imgs/sp-lb.png');
    background-position: 0px 0;
    display: inline-block;
    padding: 0 77px;
    margin: 0 50px;
    position: absolute;
    top: -10px;
}
.ul-jd li.on{
    background-position: 0 0;
}
.foot-wrap {
    height: 200px;
    background: #000;
    padding: 25px 0 35px;
}
.foot-wrap p{margin: 0;}
.foot-wrap a{text-decoration: none;}
.foot-wrap .center {width: 1200px;margin: 0 auto;text-align: center;overflow: hidden;}
.foot-wrap .center .f-logo {height: 350px;display: inline-block;vertical-align: middle;}
.foot-wrap .center .f-logo a {margin-right: 25px;width: 159px;height: 100%;line-height: 18px;float: left;color: #c5c5c5;position: relative;display: table; cursor: default;}
.foot-wrap .center .f-logo a span {display: table-cell;vertical-align: middle;text-align: center;}
.foot-wrap .center .f-logo img {width: auto;border: 0;}

/* 预约 */
.btn-group {
    width: 300px; 
    height: 240px; 
    position: absolute; 
    top: 490px; 
    left: 44%; 
    z-index: 6;
}
.btn-reserve {
    display: block;
    width: 299px; 
    height: 132px; 
    background-image: url('../imgs/btn-reserve.png'); 
    background-size: 200px 90px;
    background-repeat: no-repeat;
    transition: all .4s;
}
.btn-group .btn-reserve:hover{
    transform: scale(1.1);
}
.btn-reserve::after {
    display: block; 
    content: ''; 
    width: 299px; 
    height: 132px; 
    background-image: url('../imgs/btn-reserve.png'); 
    background-size: 250px 120px;
    opacity: 0;
}
.btn-reserve:hover::after {
    -webkit-animation: btn-shake .3s ease-in-out forwards; 
    animation: btn-shake .3s ease-in-out forwards;
}
/* 弹窗 */
.pop-wrap {
    display: none; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(0, 0, 0, .7); 
    position: absolute; 
    z-index: 999; 
    top: 0; left: 0;
}
.pop-wrap .pop-box {
    position: absolute; 
    top: 45%; 
    left: 50%; 
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%); 
    -moz-transform: translate(-50%, -50%); 
    -ms-transform: translate(-50%, -50%); 
    -o-transform: translate(-50%, -50%); 
    position: relative; 
    pointer-events: all;
}
.pop-wrap .pop-cont {text-align: center;}
.pop-wrap .btn-close {
    position: absolute; 
    width: 50px; 
    height: 50px; 
    background-image: url('../imgs/btn-close.png');
    background-repeat: no-repeat; 
    background-size: 50px 50px;
    top: -35px; 
    right: 45px;
}
.pop-login .pop-box {
    position: absolute;
    top:320px;
    left: 53%;
    width: 350px; 
    height: 350px;
    background-image: url('../imgs/pop-reserve.png') ; 
    background-repeat: no-repeat; 
    background-size: 270px 310px;
}
.pop-login .input-wrap1 {
    position: absolute;
    top: 90px;
    left: 60px;
    width: 160px; 
    height: 30px; 
    overflow: hidden; 
    margin-bottom: 10px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #000;
}
.pop-login .input-wrap2 {
    position: absolute;
    top: 150px;
    left: 60px;
    width: 160px; 
    height: 30px; 
    overflow: hidden; 
    margin-bottom: 10px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #000;
}
.pop-login .form-group {
    position: absolute;
    top: 210px;
    left: 85px;
    overflow: hidden; 
    margin-bottom: 10px;
}

/* 新闻弹出框
.popover{
    top: 186px; 
    left: 258.7px; 
    display: none;
} */
